.box {
  background-color: red;
}

.default {
  font-size: 50px;
}

.timeGrad {
  display: grid;
  grid-template-columns: repeat(12, 1fr);

  .timeGradItem {
    position: relative;
    text-align: center;
    border: solid 1px #ededed;
    padding-top: 100%;

    &.disabled {
      background: #ededed;
      color: #b9b9b9;
    }

    &.blue {
      color: #1890ff !important;
    }
    &.select {
      border: solid 1px #1890ff;
    }

    .text {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      color: inherit;
      font-style: normal;
    }

    .tips {
      position: absolute;
      bottom: 4px;
      right: 0;
      transform: rotate(-45deg);
      color: #b9b9b9;
      font-style: normal;
    }
  }
}
.flex_info {
  div {
    width: 50%;
    margin-bottom: 20px;
  }
  :global {
    .ant-input-number {
      margin-bottom: 0;
    }
    .ant-input-number-input-wrap {
      width: 100%;
      margin-bottom: 0;
    }
  }
}
.tradeHours_box {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-bottom: 20px;
  caret-color: transparent;
  .tradHourse_item {
    width: 90px;
    border: 0.5px solid #ededed;
    line-height: 67px;
    text-align: center;
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px;
    position: relative;
    .tradHourse_tips {
      position: absolute;
      font-size: 12px;
      bottom: -14px;
      right: 5px;
      transform: rotate(-45deg);
    }
    &:focus {
      outline: none;
    }
  }
  .tradHourse_hover {
    &:hover {
      box-shadow: 0 2px 8px 0 #cccccc;
    }
  }
  .tradHourseActive {
    background: #e6f4ff;
    border: 1px solid #91caff;
  }
}
.footer_box {
  position: fixed;
  bottom: 0;
  left: 20px;
  z-index: 9999;
}
